<template>
  <w-view>
    <layout-property :w="w"/>
  </w-view>
</template>

<script>
  import $ from 'dfish-widget'
  import Widget from '../Widget.vue'
  import layout from '../widget.layout.js'

  export default {
    mixins: [Widget],
    data() {
      return {
        name: 'Vertical',
        remark: '垂直布局',
        extends: [layout],
        attrs: [

        ],
        examples: [{
          remark: '标题栏+内容区效果',
          type: 'html',
          view: true,
          code: `
            <w-vertical height=160>
              <w-horizontal align="between" valign="middle" height="50" style="background:lightblue;padding:0 10px;">
                <w-html>标题</w-html>
              </w-horizontal>
              <w-vertical height="*" style="background:lightcoral">
                <w-html>内容区域</w-html>
              </w-vertical>
            </w-vertical>
            `
        }]
      }
    }
  }
</script>

<style>
</style>
